$(function () {
   
   // 初始化
   $('#user-info-pic').css('transition', ' all .45s linear')

   // 开启头像预览
   $('.container .user-pic').on('click', function () {
      let src = $(this).find('img').attr('src')
      $('#user-info-pic img').prop('src', src)
      $('#user-info-pic').css({
         opacity: 0,
         display: 'block'
      })
      setTimeout(() => {
         $('#user-info-pic').css({
            opacity: 1,
         })
      }, 100)
   })

   // 关闭图片预览
   $('#user-info-pic .btn-close').on('click', function () {
      $('#user-info-pic').css({
         opacity: 0
      })
      setTimeout(() => {
         $('#user-info-pic').css('display', 'none')
      }, 500)
   })

})